<template>
	<view class="uni-padding-wrap uni-common-mt">
		<view class="header">
			<i class="ri-function-fill" style="color:#7800BE;font-size:12px;"></i>
			<!-- <i-icon size="20upx" color="#7800BE" name="function-fill"></i-icon> -->
			控制台
			<i class="ri-arrow-right-s-line" style="color:#666;font-size:12px;"></i>
			<!-- <i-icon size="20upx" color="#666" name="arrow-right-s-line"></i-icon> -->
			站点管理
			<i class="ri-arrow-right-s-line" style="color:#666;font-size:12px;"></i>
			<!-- <i-icon size="20upx" color="#666" name="arrow-right-s-line"></i-icon> -->
			编辑站点
		</view>
		<view class="bl">
			<view class="h1">
				<i class="ri-nurse-fill" style="color:#999;font-size:16px;"></i>
				<!-- <i-icon size="30upx" color="#999" name="nurse-fill"></i-icon> -->
				编辑站点
			</view>
			<view class="r30">
				<button @click="addStation()">
					<i class="ri-shield-check-fill" style="color:#fff;font-size:12px;"></i>
					<!-- <i-icon size="20upx" color="#FFF" name="shield-check-fill"></i-icon> -->
					确定并修改
				</button>
			</view>
		</view>
		<view class="p-table">
			<view class="h2">
				<i class="ri-movie-fil" style="color:#7800BE;font-size:14px;"></i>
				<!-- <i-icon size="26upx" color="#7800BE" name="movie-fill"></i-icon> -->
				基础信息
			</view>
			<view class="com">
				<view class="li bc">
					<view class="wz">站点名称</view>
					<view class="nr">
						<input type="text" v-model="villageName" placeholder="请输入站点名称" style="width: 600px;" />
					</view>
				</view>
				<view class="li bc">
					<view class="wz">所在区域</view>
					<view class="nr">
						<view>
							<picker class="" mode="multiSelector" :range="region" range-key="name" :value="regionIndex"
								@change="pickerChange" @columnchange="pickerColumnchange">
								<view class="bc">
									<view class="pbox" :class="{'pbox_hover':regionStr != '请选择省市区'}"
										v-if="regionStr != '请选择省市区'">
										<view>{{regionStr}}</view>
									</view>
									<view v-else>
										<select>
											<option>{{area}}</option>
										</select>
									</view>
								</view>
							</picker>
						</view>
						<!-- <view v-else>
							<select @click="quyu = 1">
								<option>{{area}}</option>
							</select>
						</view> -->
					</view>
				</view>
				<view class="li bc">
					<view class="wz">详细地址</view>
					<view class="nr"><input type="text" v-model="villageAddress" placeholder="站点详细地址"
							style="width: 600px;" /></view>
				</view>
				<view class="li bc">
					<view class="wz">所属物业</view>
					<view class="nr">
						<view v-if="wuye == 1">
							<select v-model="villageProperty">
								<option value="">请选择</option>
								<option v-for="ke in wuyeList" :value="ke.name">{{ke.name}}</option>
							</select>
						</view>
						<view v-else>
							<select @click="getWuyeList()">
								<option>{{villageProperty}}</option>
							</select>
						</view>
					</view>
				</view>
				<view class="li bc">
					<view class="wz">分配站长</view>
					<view class="nr">
						<view v-if="zhanz == 1">
							<select v-model="villageAgent">
								<option value="">请选择</option>
								<option v-for="ke in agentList" :value="ke.agentName">{{ke.agentName}}</option>
							</select>
						</view>
						<view v-else>
							<select @click="getAgentList()">
								<option>{{villageAgent}}</option>
							</select>
						</view>
					</view>
				</view>
				<view class="bc">
					<view class="wz">小区环境</view>
					<view class="nr">
						<span v-for="(img,no) in stationInfo.stationImgs" :key="no">
							<image style="display:inline-block;width:100px;height:100px;" :src="img.path"
								mode="aspectFill" @tap="ViewImage([img.path])"></image>
						</span>
						<view>
							<view class="solid">
								<text class='cuIcon-cameraadd' @click="addStationImg()" style="cursor:pointer;">
									批量上传
								</text>
							</view>
						</view>
					</view>
					<view v-if="uploadStationImgModel&&stationInfo.stationImgs&&stationInfo.stationImgs.length>0">
						<button @click="uploadStationImgs(siteAlterId)">上传保存</button>
					</view>
				</view>
				<view class="li bc">
					<view class="wz">入住户数</view>
					<view class="nr"><input type="number" v-model="stationInfo.occupancyNumber" placeholder="请输入户数"
							style="width: 300px;" /></view>
				</view>
				<view class="li bc">
					<view class="wz">收楼年份</view>
					<view class="nr">
						<!-- <input type="" v-model="stationInfo.completionDate" placeholder="收楼年份"
							style="width: 600px;" /> -->
						<picker mode="date" fields="year"
							@change="stationInfo.completionDate=$event.detail.value+'-01-01'">
							<view>{{stationInfo.completionDate?stationInfo.completionDate.substring(0,4):'收楼年份'}}</view>
						</picker>
					</view>
				</view>
				<view class="" style="width:100%;margin:20px 0;">
					<view class="wz" style="display:inline-block;vertical-align:top;">禁止行业</view>
					<view class="nr" style="display:inline-block;width:calc(100% - 200px);">
						<checkbox-group @change="stationInfo.disableIndustry=$event.detail.value">
							<label v-for="(item,no) in industryList" :key="no"
								style="display:inline-block;margin-right:10px;">
								<checkbox :value="item.name" :checked="item.checked" />
								<text>{{item.name}}</text>
							</label>
						</checkbox-group>
					</view>
				</view>
			</view>
			<!-- 摊位管理start -->
			<view class="bl">
				<view class="h2">
					<i class="ri-article-line" style="color:#7800BE;font-size:18px;"></i>
					<!-- <i-icon size="26upx" color="#7800BE" name="movie-fill"></i-icon> -->
					摊位管理
				</view>
				<view class="">
					<button @click="addOrEditBooth(1)">
						<i class="ri-add-circle-fill" style="color:#fff;font-size:18px;"></i>
						添加摊位
					</button>
				</view>
			</view>
			<view class="p-table">
				<table class="pure-table pure-table-horizontal">
					<tr>
						<th>封面</th>
						<th>名称</th>
						<th>摆展位置</th>
						<th>面积/m²</th>
						<th>摆展时间</th>
						<th>物业价格/天</th>
						<th>桂民价格/天</th>
						<th>售卖日期</th>
						<th>状态</th>
						<th>操作</th>
					</tr>
					<tr v-for="(booth,index) in marketBoothArray" :key="index">
						<td>
							<view v-if="booth.imgs && booth.imgs.length>0" class="bg-img"
								style="display:flex;width:100px;height:120px;overflow-x:auto;overflow-y:hidden;margin:0 auto;">
								<span v-for="(path,no) in booth.imgs" :key="no">
									<image style="display:inline-block;width:100px;height:100px;" :src="path"
										mode="aspectFill"></image>
								</span>
							</view>
						</td>
						<td>
							<view class="bz">{{booth.name}}</view>
						</td>
						<td>
							<view class="bz">{{booth.location}}</view>
						</td>
						<td>
							<view class="bz">{{booth.area}}</view>
						</td>
						<td>
							<view class="bz">{{booth.openingTime}}至{{booth.closingTime}}</view>
						</td>
						<td>
							<view class="bz">{{booth.propertyPrice}}</view>
						</td>
						<td>
							<view class="bz">{{booth.price}}</view>
						</td>
						<td>
							<view class="bz">
								<view class="">
									<view class="">{{booth.sellType}}</view>
									<view class="" style="max-width:250px;">{{booth.sellDateList.toString()}}</view>
								</view>
							</view>
						</td>
						<td>
							<view class="bz">{{booth.state}}</view>
						</td>
						<td>
							<view class="bz">
								<button @click="addOrEditBooth(2,booth)" class="b-dell">
									<i class="ri-delete-bin-line" style="color:#333;font-size:12px;"></i>
									编辑
								</button>
								<button @click="delBooth(booth,index)" class="b-dell">
									<i class="ri-delete-bin-line" style="color:#333;font-size:12px;"></i>
									删除
								</button>
							</view>
						</td>
					</tr>
					<view class="bz" style="width: 100%;">
					</view>
				</table>
			</view>
			<view v-if="boothModel=='add'||boothModel=='edit'" class="popup-layer">
				<view class="win-card">
					<view class="win-head">
						<view class=""></view>
						<view class="" v-if="boothDto.id">编辑摊位</view>
						<view class="" v-else>添加摊位</view>
						<view class="" @tap="boothModel=null" style="height:100%;padding:0 10px;cursor:pointer;"><i
								class="ri-close-line"></i></view>
					</view>
					<view class="win-body">
						<view class="">
							<view class="form-name">封面</view>
							<view class="form-value">
								<view v-if="boothDto.imgFiles && boothDto.imgFiles.length>0" class="bg-img"
									style="display:flex;width:100px;height:120px;overflow-x:auto;overflow-y:hidden;margin:0 auto;">
									<span v-for="(file,no) in boothDto.imgFiles" :key="no">
										<image style="display:inline-block;width:100px;height:100px;" :src="file.path"
											mode="aspectFill" alt="封面"></image>
									</span>
								</view>
								<view class="solid">
									<text class='cuIcon-cameraadd' @click="addBoothImg()"
										style="cursor:pointer;color:#ffaa00;;">
										上传封面
									</text>
								</view>
							</view>
						</view>
						<view v-if="boothDto.id" class="">
							<view class="form-name">摊位ID</view>
							<view class="form-value">{{boothDto.id}}</view>
						</view>
						<view class="">
							<view class="form-name">名称<font color="#f00">*</font>
							</view>
							<view class="form-value">
								<input type="text" v-model="boothDto.name" placeholder="名称" />
							</view>
						</view>
						<view class="">
							<view class="form-name">摆展位置<font color="#f00">*</font>
							</view>
							<view class="form-value">
								<input type="text" v-model="boothDto.location" placeholder="请输入摆展位置,如:正门广场A区"
									style="width: 90%;" />
							</view>
						</view>
						<view class="">
							<view class="form-name">面积/m²<font color=#ff0000>*</font>
							</view>
							<view class="form-value">
								<input type="number" v-model="boothDto.area" placeholder="预估面积,如:3m²" />
							</view>
						</view>
						<view class="">
							<view class="form-name">摆展时间<font color=#ff0000>*</font>
							</view>
							<view class="form-value" style="display:inline-flex;align-items:center;">
								<picker mode="time" @change="TimePicker($event,boothDto,1)">
									<view v-html="boothDto.openingTime||`<font color=#888>开始时间</font>`"
										style="border:1px solid #ddd;padding:5px;">
									</view>
								</picker>
								至
								<picker mode="time" @change="TimePicker($event,boothDto,2)">
									<view v-html="boothDto.closingTime||`<font color=#888>结束时间</font>`"
										style="border:1px solid #ddd;padding:5px;">
									</view>
								</picker>
							</view>
						</view>
						<view class="">
							<view class="form-name">物业价格/天<font color=#ff0000>*</font>
							</view>
							<view class="form-value">
								<input type="digit" v-model="boothDto.propertyPrice" placeholder="物业价格(元/天)" />
							</view>
						</view>
						<view class="">
							<view class="form-name">桂民价格/天<font color=#ff0000>*</font>
							</view>
							<view class="form-value">
								<input type="digit" v-model="boothDto.price" placeholder="桂民价格(元/天)" />
							</view>
						</view>
						<view class="">
							<view class="form-name">售卖日期<font color=#ff0000>*</font>
							</view>
							<view class="form-value">
								<picker mode="selector" :range="['默认','指定日期','指定星期']"
									@change="boothDto.sellType=['默认','指定日期','指定星期'][$event.detail.value];boothDto.sellDateList=[]">
									<view style="border:1px solid #ddd;border-radius:4px;">
										{{boothDto.sellType||'默认'}}
									</view>
								</picker>
								<view v-if="boothDto.sellType=='指定日期'" class="">
									<view class="">
										<picker mode="date" value="2022-01-01"
											@change="boothDto.sellDateList.push($event.detail.value)">
											<view style="color:#ffaa00;">添加日期</view>
										</picker>
									</view>
									<view v-for="(item,index) in boothDto.sellDateList" :key="index"
										style="display:inline-block;margin:5px 10px;">
										{{item}}<i class="ri-close-circle-fill" style="color:#ff5500;"
											@tap="boothDto.sellDateList.splice(index,1)"></i>
									</view>
								</view>
								<view v-else-if="boothDto.sellType=='指定星期'" class="">
									<picker mode="selector" :range="['周一','周二','周三','周四','周五','周六','周日']"
										@change="boothDto.sellDateList.push(['周一','周二','周三','周四','周五','周六','周日'][$event.detail.value])">
										<view style="color:#ffaa00;">添加星期</view>
									</picker>
									<view v-for="(item,index) in boothDto.sellDateList" :key="index"
										style="display:inline-block;margin:5px 10px;">
										{{item}}<i class="ri-close-circle-fill" style="color:#ff5500;"
											@tap="boothDto.sellDateList.splice(index,1)"></i>
									</view>
								</view>
							</view>
						</view>
						<view class="">
							<view class="form-name">状态<font color=#ff0000>*</font>
							</view>
							<view class="form-value">
								<picker mode="selector" :range="['正常','下架']"
									@change="boothDto.state=['正常','下架'][$event.detail.value]"
									style="border:1px solid #ddd;padding:5px 10px;">
									<view>{{boothDto.state}}</view>
								</picker>
							</view>
						</view>
						<view class="" style="text-align:center;position:relative;bottom:0;">
							<button class="p-btn" @click="saveMarketBooth(boothDto)">保存</button>
						</view>
					</view>
				</view>
			</view>
			<!-- 摊位管理end -->
			<view class="bl r30 l10" style="margin-top: 30px;">
				<view class="h2">
					<i class="ri-movie-fill" style="color:#7800BE;font-size:14px;"></i>
					<!-- <i-icon size="26upx" color="#7800BE" name="movie-fill"></i-icon> -->
					常规服务
				</view>
				<button type="button" @click="addcg()">
					<i class="ri-add-circle-fill" style="color:#fff;font-size:12px;"></i>
					<!-- <i-icon size="20upx" color="#FFF" name="add-circle-fill"></i-icon> -->
					添加服务
				</button>
			</view>
			<view class="p-table">
				<table class="pure-table pure-table-horizontal">
					<tr>
						<th>id编号</th>
						<th>封面</th>
						<th>服务名称</th>
						<th>收费价格</th>
						<th>免费服务时间</th>
						<th>操作</th>
					</tr>
					<tr v-for="item in cgList" v-if="item.length != 0">
						<td>
							{{item.id}}
						</td>
						<td v-if="item.imgPath == undefined || item.imgPath == ''  || item.imgPath == null">
							<image style="width: 100px; height: 100px;" src="../../static/user.jpg"
								@click="shangCuanTP(item.id)" mode="aspectFill">
							</image>
						</td>
						<td v-else>
							<image style="width: 100px; height: 100px;"
								:src="'https://admin.yunshuicha.com'+item.imgPath" @click="shangCuanTP(item.id)"
								mode="aspectFill">
							</image>
						</td>
						<!-- <td v-else>
							<image style="width: 100px; height: 100px;" :src="'data:image/jpeg;base64,'+item.imgPath"
								@click="shangCuanTP(item.id)" mode="aspectFill">
							</image>
						</td> -->
						<td>
							<view class="bz"><input type="text" v-model="item.serve" placeholder="名称"
									style="width: 150px;" /></view>
						</td>
						<td>
							<view class="bz"><input type="text" v-model="item.sitePrice" placeholder="价格"
									style="width: 150px;" /></view>
						</td>
						<td>
							<!-- 编辑 -->
							<view v-if="sp==item.id">
								<view v-if='ss == 1' class="bz">
									<picker class="r10" mode="date" :id="item.id" :value="sdate" :start="startDate"
										:end="endDate" @change="bindDateChange">
										<view class="uni-input">{{item.freeDate}}</view>
									</picker>
									<i class="ri-close-circle-fill" style="color:#f73164;font-size:16px;"
										@click="sp=null"></i>
									<!-- <i-icon size="30upx" color="#f73164" name="close-circle-fill" @click="sp=null">
									</i-icon> -->
								</view>
								<view v-else-if="ss == 2" class="bz r10">
									<select v-model="item.freeDate">
										<option value="星期一">每周一</option>
										<option value="星期二">每周二</option>
										<option value="星期三">每周三</option>
										<option value="星期四">每周四</option>
										<option value="星期五">每周五</option>
										<option value="星期六">每周六</option>
										<option value="星期日">每周天</option>
									</select>
									<i class="ri-close-circle-fill" style="color:#f73164;font-size:16px;"
										@click="sp=null,item.freeDate = '请选择免费日'"></i>
									<!-- <i-icon size="30upx" color="#f73164" name="close-circle-fill"
										@click="sp=null,item.freeDate = '请选择免费日'"></i-icon> -->
								</view>
							</view>
							<!-- 显示 -->
							<view v-else>
								<view v-if="item.freeDate == '请选择免费日'" class="bz">
									<button @click="ferr(item,1)" class="r10">特定</button>
									<button @click="ferr(item,2)">每周</button>
								</view>
								<view v-else class="bz">
									<view class="r10">
										{{item.freeDate}}
									</view>
									<i class="ri-close-circle-fill" style="color:#f73164;font-size:18px;"
										@click="item.freeDate = '请选择免费日'"></i>
									<!-- <i-icon size="30upx" color="#f73164" name="close-circle-fill"
										@click="item.freeDate = '请选择免费日'"></i-icon> -->

								</view>
							</view>
						</td>
						<td>
							<view class="bz">
								<!-- 	 -->
								<button type="button" style="width: 100px" class="b-dell" @click="deleteFuwu(item,1)">

									<i class="ri-delete-bin-line" style="color:#333;font-size:12px;"></i>
									<!-- <i-icon size="20upx" color="#333" name="delete-bin-line"></i-icon> -->
									删除
								</button>
							</view>
						</td>
					</tr>
					<tr v-else>
						暂无数据，请添加
					</tr>
				</table>
			</view>
			<view class="bl r30 l10" style="margin-top: 30px;">
				<view class="h2">
					<i class="ri-movie-fill" style="color:#7800BE;font-size:14px;"></i>
					<!-- <i-icon size="26upx" color="#7800BE" name="movie-fill"></i-icon> -->
					废旧回收
				</view>
				<button type="button" @click="addlaji()">
					<i class="ri-add-circle-fill" style="color:#fff;font-size:12px;"></i>
					<!-- <i-icon size="20upx" color="#FFF" name="add-circle-fill"></i-icon> -->
					添加服务
				</button>
			</view>
			<view class="p-table">
				<table class="pure-table pure-table-horizontal">
					<tr>
						<th>id编号</th>
						<th>一级分类</th>
						<th>废旧名称</th>
						<th>收费价格</th>
						<th>单位</th>
						<th>操作</th>
					</tr>
					<tr v-for="key in lajiList" v-if='key.length != 0'>
						<td>
							{{key.recyclesTwoId}}
						</td>
						<td>
							{{key.recyclesOneName}}
						</td>
						<td>{{key.recyclesTwoName}}</td>
						<td>
							<input type="text" placeholder="价格" v-model="key.recyclesPrice" />
						</td>
						<td>
							<select v-model="key.recyclesUnit">
								<option value="两">两</option>
								<option value="斤">斤</option>
								<option value="公斤">公斤</option>
								<option value="吨">吨</option>
							</select>
						</td>
						<td>
							<view class="bz">
								<button type="button" style="width: 100px" class="b-dell" @click="deleteFuwu(key,2)">
									<i class="ri-delete-bin-line" style="color:#333;font-size:12px;"></i>
									<!-- <i-icon size="20upx" color="#333" name="delete-bin-line"></i-icon> -->
									删除
								</button>
							</view>
						</td>
					</tr>
					<tr v-else>
						暂无数据，请添加
					</tr>
				</table>
			</view>
			<!-- 添加弹出框 -->
			<view v-if="tc == 1" class="p-tkb">
				<view class="p-tkh"></view>
				<view class="p-tk" style="width: 600px;">
					<view class="h2 bl">
						<view class="bc">
							<i class="ri-movie-fill" style="color:#7800BE;font-size:16px;"></i>
							<!-- <i-icon size="26upx" color="#7800BE" name="movie-fill"></i-icon> -->
							常规服务
						</view>
						<i class="ri-close-circle-fill" style="color:#f73164;font-size:16px;" @click="tc=false"></i>
						<!-- <i-icon size="30upx" color="#f73164" name="close-circle-fill" @click="tc=false"
							style="margin-right: 25px;"></i-icon> -->
					</view>
					<view class="">
						<!-- 上传封面 -->
						<view class="com">
							<view class="li bc">
								<view class="wz">服务封面:</view>
								<view class="bg-img" style="width: 100px; height: 100px;"
									v-if="addSevList.yyPath != ''">
									<button @click="DelImg(addSevList.index)">X</button>
									<image style="width: 100px; height: 100px;" :src="addSevList.yyPath[0]"
										mode="aspectFill" @tap="ViewImage(addSevList.yyPath)">
									</image>
								</view>
								<view v-else>
									<view class="solid" @tap="ChooseImage(addSevList.index)">
										<text class='cuIcon-cameraadd'>上传封面</text>
									</view>
								</view>
							</view>
							<view class="li bc">
								<view class="wz">服务名称:</view>
								<view class="nr"><input type="text" v-model="addSevList.name" placeholder="服务名称" />
								</view>
							</view>
							<view class="li bc">
								<view class="wz">服务价格:</view>
								<view class="nr"><input type="text" v-model="addSevList.price" placeholder="服务价格" />
								</view>
							</view>
							<view class="li bc">
								<view class="wz">免费日期:</view>
								<view class="nr">
									<view v-if="addSevList.freeDate == ''">
										<view v-if="state == false">
											<radio-group @change="radioChange" @click="cgIndex = addSevList.index">
												<label class="radio r30">
													<radio value="r1" color="#7800BE" />开启
												</label>
												<label class="radio">
													<radio value="r2" color="#DC2626" checked="" />禁用
												</label>
											</radio-group>
										</view>
										<!-- 选择免费日层 -->
										<view v-if="state=='true'">
											<view class="tb">
												<view class="titem">
													<i class="ri-pencil-fill" style="color:#7800BE;font-size:12px;"></i>
													<!-- <i-icon size="20upx" color="#7800BE" name="pencil-fill" class="r10">
													</i-icon> -->
													选择免费日
												</view>
												<i class="ri-close-circle-fill"
													style="color:#f73164;font-size:14px;"></i>
												<!-- <i-icon size="25upx" color="#f73164" name="close-circle-fill"
													@click="state=false"></i-icon> -->
											</view>
											<view class="com">
												<view class="li bc">
													<view v-if="sp==cgIndex">
														<view v-if='ss == 1'>
															<picker mode="date" :id="cgIndex" :value="sdate"
																:start="startDate" :end="endDate"
																@change="addBindDateChange">
																<view class="uni-input">选择日期:{{addSevList.freeDate}}
																</view>
															</picker>
															<i class="ri-close-circle-fill"
																style="color:#f73164;font-size:14px;"
																@click="sp=null"></i>
															<!-- <i-icon size="25upx" color="#f73164"
																name="close-circle-fill" @click="sp=null">
															</i-icon> -->
														</view>
														<view v-else-if="ss == 2">
															<select v-model="addSevList.freeDate">
																<option value="星期一">每周一</option>
																<option value="星期二">每周二</option>
																<option value="星期三">每周三</option>
																<option value="星期四">每周四</option>
																<option value="星期五">每周五</option>
																<option value="星期六">每周六</option>
																<option value="星期日">每周天</option>
															</select>
															<i class="ri-close-circle-fill"
																style="color:#f73164;font-size:14px;"
																@click="sp=null,addSevList.freeDate = ''"></i>
															<!-- <i-icon size="25upx" color="#f73164"
																name="close-circle-fill"
																@click="sp=null,addSevList.freeDate = ''">
															</i-icon> -->
														</view>
													</view>
													<!-- 显示 -->
													<view v-else>
														<view>
															<button @click="sp=cgIndex,ss=1">特定某天</button>
															<button @click="sp=cgIndex,ss=2">每周星期</button>
														</view>
													</view>
												</view>
											</view>
										</view>

									</view>
									<view v-else>
										<view @click="state ='true',addSevList.freeDate ='',sp=null,ss=0">
											{{addSevList.freeDate}}
										</view>
									</view>
									<!-- 选择免费日层 -->
								</view>
							</view>
						</view>
						<view class="bz" style="margin-bottom: 60px;">
							<button @click="addCgServeData()">
								<i class="ri-arrow-right-s-line" style="color:#fff;font-size:12px;"></i>
								<!-- <i-icon size="20upx" color="#fff" name="arrow-right-s-line"></i-icon> -->
								确认添加
							</button>
						</view>
					</view>
				</view>
			</view>
			<!-- 添加弹出框2 -->
			<view v-if="tc == 2" class="p-tkb">
				<view class="p-tkh"></view>
				<view class="p-tk">
					<view class="bl">
						<view class="h2 bc">
							<i class="ri-movie-fill" style="color:#7800BE;font-size:14px;"></i>
							<!-- <i-icon size="26upx" color="#7800BE" name="movie-fill"></i-icon> -->
							废旧回收
						</view>
						<i class="ri-close-circle-fill" style="color:#f73164;font-size:16px;" @click="tc=false"></i>
						<!-- <i-icon class="r30" size="30upx" color="#f73164" name="close-circle-fill" @click="tc=false">
						</i-icon> -->
					</view>
					<view class="p-table">
						<table class="pure-table pure-table-horizontal">
							<tr>
								<th>选择</th>
								<th>一级名称</th>
								<th>二级名称</th>
								<th>收费价格</th>
								<th>重量单位</th>
							</tr>
							<tr v-for="key in lajiTwoList" v-if="key != '填充数据'">
								<td>
									<checkbox-group @change="lajicheckboxChange(key)">
										<checkbox :checked="key.checked"></checkbox>
									</checkbox-group>
								</td>
								<td>
									{{key.name}}
								</td>
								<td>{{key.twoName}}</td>
								<td>
									<input type="text" placeholder="价格" v-model="key.price" />
								</td>
								<td>
									<select v-model="key.unit">
										<option value="两">两</option>
										<option value="斤">斤</option>
										<option value="公斤">公斤</option>
										<option value="吨">吨</option>
									</select>
								</td>
							</tr>
							<tr v-else>

							</tr>
						</table>
					</view>
					<view class="bz" style="margin-bottom: 50px;">
						<button @click="addLajiServeData()">确认添加</button>
					</view>
				</view>
			</view>

		</view>
		<view v-if="cropper.img"
			style="display:block;width:900px;height:700px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background-color:#fff;border:1px solid #888;z-index:99;">
			<VueCropper ref="cropper" :img="cropper.img" :outputSize="cropper.outputSize"
				:outputType="cropper.outputType" :info="cropper.info" :canScale="cropper.canScale"
				:autoCrop="cropper.autoCrop" :autoCropWidth="cropper.autoCropWidth"
				:autoCropHeight="cropper.autoCropHeight" :fixed="cropper.fixed" :fixedNumber="cropper.fixedNumber"
				:full="cropper.full" :fixedBox="cropper.fixedBox" :canMove="cropper.canMove"
				:canMoveBox="cropper.canMoveBox" :original="cropper.original" :centerBox="cropper.centerBox"
				:height="cropper.height" :infoTrue="cropper.infoTrue" :maxImgSize="cropper.maxImgSize"
				:enlarge="cropper.enlarge" :mode="cropper.mode" style="height:90%;">
				截图组件加载失败
			</VueCropper>
			<view class="">
				<button type="button" @click="getCropImage">截图</button>
			</view>
		</view>
	</view>
</template>

<script>
	import region from '../../components/k-region/pca-code.json';
	import axios from 'axios'
	import {
		VueCropper
	} from 'vue-cropper'
	export default {
		components: {
			VueCropper
		},
		data() {
			const currentDate = this.getDate({
				format: true
			})
			return {
				xqData: '',
				// 原数组
				oldRegion: region,
				// 处理后的数组
				region: [
					[],
					[],
					[]
				],
				// 选择省市区的下标Index  传则默认选中传递的
				regionIndex: [0, 0, 0],

				// 省市区字符串
				regionStr: '请选择省市区',
				cgIndex: '',
				state: false,
				quyu: 0,
				tc: 0,
				wuye: 0,
				zhanz: 0,
				add: false,
				checked: false,
				sdate: '',
				ss: null,
				sp: null,
				laterYyImg: '', //编辑（预览图片）
				trueImgPath: '', //编辑（图片路径）
				area: '', //所在区域
				siteAlterId: '', //该站点唯一id
				date: currentDate,
				zdPrice: '', //站点价格
				zdUnit: '', //站点单位
				villageName: '', //站点名称
				villageAddress: '', //站点地址
				villageProperty: '', //站点物业
				villageAgent: '', //站长
				villagePrice: '', //站点价格
				serveList: [], //显示服务表
				serList: [], //添加站点服务数据表
				addSevList: {
					index: 0,
					id: '',
					notBase64ImgPath: '',
					yyPath: '',
					name: '',
					price: '',
					freeDate: ""
				}, //显示服务表
				wuyeList: [],
				agentList: [],
				cgList: [], //常规服务表
				lajiList: [], //垃圾表
				lajiAddList: [], //垃圾添加数据表
				lajiOneList: [],
				lajiTwoList: [],
				alterList: [],
				uploadStationImgModel: false,
				stationInfo: {
					stationImgs: [],
					//竣工时间
					completionDate: '',
					//禁用行业
					disableIndustry: [],
					occupancyNumber: ''
				},
				//小区摊位列表
				marketBoothArray: [],
				// 行业
				industryList: ["地产", "中介", "金融", "保险", "银行", "建材", "装修",
					"家居", "家电", "医美", "美容", "保健", "医院", "口腔", "眼科",
					"养老", "快消", "食品", "酒水", "教育", "通信", "汽车", "电商", "其他"
				],
				boothModel: '',
				boothDto: {
					stationId: '',
					name: '',
					location: '',
					area: '',
					price: '',
					unit: '',
					openingTime: '',
					closingTime: '',
					imgFiles: [],
					disableIndustry: [],
					propertyPrice: '',
					sellType: '',
					sellDateList: [],
					state: ''
				},
				cropper: {
					index: '',
					img: '', //裁剪图片的地址
					outputSize: 1, //裁剪生成图片的质量(可选0.1 - 1)
					outputType: 'jpeg', //裁剪生成图片的格式（jpeg || png || webp）
					info: true, //图片大小信息
					canScale: true, //图片是否允许滚轮缩放
					autoCrop: true, //是否默认生成截图框
					autoCropWidth: 300, //默认生成截图框宽度
					autoCropHeight: 300, //默认生成截图框高度
					fixed: true, //是否开启截图框宽高固定比例
					fixedNumber: [1, 1], //截图框的宽高比例
					full: false, //false按原比例裁切图片，不失真
					fixedBox: false, //固定截图框大小，不允许改变
					canMove: false, //上传图片是否可以移动
					canMoveBox: true, //截图框能否拖动
					original: false, //上传图片按照原始比例渲染
					centerBox: false, //截图框是否被限制在图片里面
					height: true, //是否按照设备的dpr 输出等比例图片
					infoTrue: false, //true为展示真实输出图片宽高，false展示看到的截图框宽高
					maxImgSize: 3000, //限制图片最大宽度和高度
					enlarge: 1, //图片根据截图框输出比例倍数
					mode: '300px 300px' //图片默认渲染方式
				}
			}
		},
		props: {
			// 组件高度
			height: {
				type: [Number],
				default: 92
			},
			// 组件宽度
			width: {
				type: [Number],
				default: 710
			},
			// 省id
			previnceId: {
				type: [Number],
				default: 11
			},
			// 城市id
			cityId: {
				type: [Number],
				default: 1101
			},
			// 县区id
			countyId: {
				type: [Number],
				default: 110101
			},
			// 是否是为修改(true为修改)
			isRevise: {
				type: [Boolean],
				default: false
			}
		},
		computed: {
			startDate() {
				return this.getDate('start');
			},
			endDate() {
				return this.getDate('end');
			}
		},
		methods: {
			//获取截图
			getCropImage() {
				let that = this
				//展位上传图片截图
				if (this.cropper.index === 1) {
					this.$refs.cropper.getCropBlob(blob => {
						let file = new window.File([blob], "img.jpg", {
							type: blob.type
						})
						file['path'] = window.URL.createObjectURL(file)
						// console.log(file)
						that.boothDto.imgFiles = [file]
						that.cropper.img = ''
					})
				}
			},
			//上传站点环境图片
			uploadStationImgs(stationId) {
				if (!stationId || !(this.stationInfo.stationImgs instanceof Array) || this.stationInfo.stationImgs
					.length == 0) {
					return
				}
				let that = this
				let imgArr = this.stationInfo.stationImgs.map((value, index) => {
					return {
						name: 'files',
						uri: value.path
					}
				});
				// console.log(imgArr, "============================")
				uni.showLoading({
					mask: true
				})
				uni.uploadFile({
					url: that.baseURL + "/guiminSite/saveStationImgs/" + stationId,
					header: {
						// "Content-Type": "multipart/form-data",
						'token': uni.getStorageSync('token')
					},
					files: imgArr,
					name: 'files',
					fileType: 'image',
					success: (res) => {
						uni.hideLoading()
						// console.log('uploadStationImgs:', res)
						if (res.statusCode == 200) {
							let data = JSON.parse(res.data);
							if (data.code == 0 || data.success == true) {
								uni.showToast({
									title: '上传成功',
									duration: 3000
								})
							} else {
								uni.showToast({
									title: data.message || '上传错误',
									icon: 'error',
									duration: 3000
								})
							}
						} else {

						}
					},
					fail(e) {
						uni.hideLoading()
						console.error(e)
					}
				})
			},
			//添加小区图片
			addStationImg() {
				let that = this
				uni.chooseImage({
					count: 6,
					sizeType: ['original', 'compressed'],
					sourceType: ['album'],
					success: function(res) {
						that.uploadStationImgModel = true
						res.tempFiles
						that.stationInfo.stationImgs = []
						for (let file of res.tempFiles) {
							if (file.size / 1024 <= 2048) {
								that.stationInfo.stationImgs.push(file)
							}
						}
					}
				});
			},
			//获取摊位列表
			getBoothPage(current, size, search) {
				let that = this
				let params = "?cuurent=" + (current || 1) + "&size=" + (size || 100);
				if (search) {
					for (let key in search) {
						params = params + '&' + key + '=' + search[key]
					}
				}
				uni.request({
					url: that.baseURL + "/marketBooth/getBoothList" + params,
					method: 'GET',
					header: {
						token: uni.getStorageSync('token')
					},
					success(res) {
						if (res.statusCode == 200) {
							let data = res.data
							if (data.success == true) {
								data = data.data
								let records = data.records
								// console.log("摊位列表", records)
								for (let index in records) {
									let booth = records[index]
									if (booth.imgs) {
										let _arr = []
										for (let path of booth.imgs.split(',')) {
											_arr.push(that.baseURL.replace('api', '') + "/images/booth/" + path)
										}
										records[index].imgs = _arr
									}
									if (booth.disableIndustry) {
										records[index].disableIndustry = booth.disableIndustry.split(",")
									} else {
										records[index].disableIndustry = []
									}
									// records[index]['imgs'] = []
								}
								that.marketBoothArray = records;
							} else {
								uni.showToast({
									title: res.data.message,
									icon: 'none',
									duration: 3000
								})
							}
						}

					}
				})
			},
			//新增摊位
			addOrEditBooth(model, boothItem) {
				for (let key in this.boothDto) {
					if (this.boothDto[key] instanceof Array) {
						this.boothDto[key] = []
					} else this.boothDto[key] = ''
				}
				if (model == 1) {
					this.boothModel = `add`;
					this.boothDto.stationId = this.siteAlterId
				} else if (model == 2) {
					// console.log('item',boothItem)
					this.boothModel = `edit`;
					for (let key in boothItem) {
						if (boothItem[key]) this.boothDto[key] = JSON.parse(JSON.stringify(boothItem[key]));
					}
					this.boothDto['sellDateList'] = []
				}
			},
			//删除摊位
			delBooth(booth, index) {
				if (!booth || !booth.id) {
					this.marketBoothArray.splice(index, 1)
					return
				}
				let that = this
				uni.showModal({
					content: '确认删除摊位？',
					success(res) {
						if (res.confirm) {
							uni.request({
								url: that.baseURL + "/marketBooth/delBooth/" + booth.id,
								method: 'DELETE',
								header: {
									token: uni.getStorageSync('token')
								},
								success(data) {
									if (data.statusCode == 200) {
										data = data.data
										if (data.code == 0) {
											uni.showToast({
												title: data.message || '删除成功'
											})
											that.getBoothPage(1, 100, {
												stationId: that.siteAlterId
											})
										} else {
											uni.showToast({
												title: data.message,
												icon: 'error',
												duration: 3000
											})
										}
									}

								}
							})
						}
					}
				})
			},
			//时间选择器
			TimePicker(e, booth, k) {
				if (k === 1) {
					booth['openingTime'] = e.detail.value
				} else if (k === 2) {
					booth['closingTime'] = e.detail.value
				}
			},
			//添加摊位图片
			addBoothImg() {
				let that = this
				uni.chooseImage({
					count: 1,
					sizeType: ['original', 'compressed'],
					sourceType: ['album'],
					success: function(res) {
						// res.tempFiles
						that.boothDto['imgFiles'] = []
						for (let file of res.tempFiles) {
							if (file.size / 1024 <= 2048) {
								// that.boothDto['imgFiles'].push(file)
								that.cropper.img = file.path
								that.cropper.index = 1
							} else {
								uni.showToast({
									title: '图片不能大于2M',
									icon: 'none',
									duration: 3000
								})
								break
							}
						}
					}
				});
			},
			//保存摊位
			saveMarketBooth: function(booth) {
				let that = this
				let showMsg = function(mesage) {
					uni.showToast({
						title: mesage,
						icon: 'error',
						duration: 3000
					})
				};
				//新建表单
				let formData = new window.FormData();
				//校验数据
				if (booth.id) formData.append('boothId', booth.id);
				else if (this.boothModel == 'edit') {
					showMsg("摊位id不能为空");
					return
				}
				if (booth.stationId) formData.append('stationId', booth.stationId);
				else {
					showMsg("站点id不能为空");
					return
				}
				if (booth.name) formData.append('name', booth.name);
				else {
					showMsg("名称不能为空");
					return
				}
				if (booth.location) formData.append('location', booth.location);
				else {
					showMsg("位置不能为空");
					return
				}
				if (booth.area) formData.append('area', booth.area);
				else {
					showMsg("面积不能为空");
					return
				}
				if (booth.price) formData.append('price', booth.price);
				else {
					showMsg("单价不能为空");
					return
				}
				if (booth.unit) formData.append('unit', booth.unit);
				else {
					formData.append('unit', "元/天")
				}
				if (booth.openingTime) formData.append('openingTime', booth.openingTime);
				else {
					showMsg("开放时间不能为空");
					return
				}
				if (booth.closingTime) formData.append('closingTime', booth.closingTime);
				else {
					showMsg("关闭时间不能为空");
					return
				}
				if (booth.disableIndustry && booth.disableIndustry.length > 0) {
					formData.append('disableIndustry', booth.disableIndustry.toString());
				}
				if (booth.propertyPrice) formData.append('propertyPrice', booth.propertyPrice);
				else {
					showMsg("物业单价不能为空");
					return
				}
				if (booth.imgFiles instanceof Array) {
					for (let file of booth.imgFiles) {
						formData.append('imgFiles', file);
					}
				}
				if (booth.sellType && booth.sellType != '默认') {
					formData.append('sellType', booth.sellType);
					if (booth.sellDateList instanceof Array) {
						for (let val of booth.sellDateList) {
							if (booth.sellType == '指定日期' && /^\d{4}-\d{2}-\d{2}$/.test(val))
								formData.append('sellDateList', val);
							else if (booth.sellType == '指定星期') {
								formData.append('sellDateList', val);
							};
						}
					}
				}
				if (booth.state) formData.append('state', booth.state)

				// console.log("待发送数据：", booth, formData)
				uni.showLoading({
					title: "正在保存摊位信息",
					mask: true
				})
				let _url = this.baseURL + '/marketBooth/updateBooth'
				let _method = 'PUT'
				if (!booth.id) {
					_url = this.baseURL + '/marketBooth/add'
					_method = "POST"
				}
				axios.request({
					url: _url,
					method: _method,
					headers: {
						'Content-Type': 'multipart/form-data',
						'token': uni.getStorageSync('token')
					},
					data: formData
				}).then((response) => {
					uni.hideLoading()
					if (response.status == 200) {
						let data = response.data
						if (data.code == 0 || data.success == true) {
							that.boothModel = ""
							that.getBoothPage(1, 100, {
								stationId: that.siteAlterId
							})
							uni.showToast({
								title: data.message || '摊位保存成功',
								icon: 'success',
								duration: 3000
							})
						} else {
							uni.showToast({
								title: data.message || '摊位保存失败',
								icon: 'success',
								duration: 3000
							})
						}
					} else {
						uni.showToast({
							title: '网络异常：' + response.statusText,
							icon: 'error',
							duration: 3000
						})
						console.error(response)
					}
				}).catch((e) => {
					uni.hideLoading()
					uni.showToast({
						title: '网络连接超时',
						icon: 'error',
						duration: 3000
					})
					console.error(e)
				});

			},
			/**
			 * 编辑（上传图片）
			 */
			shangCuanTP(trueID) {
				let _this = this;
				uni.showLoading({});
				uni.chooseImage({
					count: 1, //默认9
					crop: {
						quality: 80,
						width: 100,
						height: 100,
						resize: true
					},
					success: (res) => {
						_this.laterYyImg = res.tempFilePaths;
						const tempFilePaths = res.tempFilePaths;
						uni.uploadFile({
							url: _this.baseURL + '/guiminService/upload/pic?name=' + _this.villageName,
							header: {
								'token': uni.getStorageSync('token')
							},
							filePath: tempFilePaths[0],
							name: 'file',
							success: function(uploadFileRes) {
								//console.log(uploadFileRes)
								if (uploadFileRes.statusCode == 200) {
									let fileData = JSON.parse(uploadFileRes.data)
									//console.log(fileData.data.src);
									_this.trueImgPath = fileData.data.src;
									let resData = {
										"id": trueID,
										"imgPath": _this.trueImgPath
									}
									uni.request({
										url: _this.baseURL + '/guiminSite/revise',
										method: 'POST',
										header: {
											'token': uni.getStorageSync('token')
										},
										data: resData,
										success: function(res) {
											console.log(res)
											uni.hideLoading();
											if (res.data.success == true) {
												let yemData = {
													'villageName': _this
														.villageName
												};
												_this.cgList = [];
												_this.getStisCGtList(
													yemData); //刷新常规服务表
											}
										}
									})
								} else {
									uni.hideLoading();
									uni.showToast({
										title: '上传图片不能超过2M，请重新上传',
										icon: 'none',
										duration: 2500
									})
									_this.laterYyImg = null;
								}
							},
							fail: function(err) {
								console.log("请求失败\n" + JSON.stringify(err))
								uni.showToast({
									title: err,
									icon: 'none',
									duration: 2000
								})
							}
						});
					}
				});
			},
			//选择星期
			xingQi(id) {
				console.log(id)
				for (let i in this.cgList) {
					let ti = this.cgList[i];
					if (ti.id == id) {
						ti.freeDate = this.xqData;
					}
				}
			},
			//添加服务状态选择
			radioChange(e) {
				//console.log(leng)
				if (e.detail.value == 'r1') {
					this.state = 'true'
				}
				if (e.detail.value == 'r2') {
					this.state = 'false'
				}
				console.log(this.state)
			},

			//上传图片
			ChooseImage(index) {
				let _this = this;
				uni.chooseImage({
					count: 10, //默认9
					crop: {
						'width': 40,
						'height': 50
					},
					//sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有

					success: (res) => {
						_this.addSevList.yyPath = res.tempFilePaths;
						const tempFilePaths = res.tempFilePaths;
						uni.uploadFile({
							url: _this.baseURL + '/guiminService/upload/pic?name=' + _this.villageName,
							header: {
								'token': uni.getStorageSync('token')
							},
							filePath: tempFilePaths[0],
							name: 'file',
							success: function(uploadFileRes) {
								//console.log(uploadFileRes)
								if (uploadFileRes.statusCode == 200) {
									let fileData = JSON.parse(uploadFileRes.data)
									//console.log(fileData.data.src);
									_this.certBackUrl = fileData.data.src;
									_this.addSevList.notBase64ImgPath = fileData.data.src;
								} else {
									uni.showToast({
										title: '上传图片不能超过2M，请重新上传',
										icon: 'none',
										duration: 2500
									})
									_this.imgList = [];
								}
							},
							fail: function(err) {
								console.log("请求失败\n" + JSON.stringify(err))
								uni.showToast({
									title: err,
									icon: 'none',
									duration: 2000
								})
							}
						});
					}
				});
			},
			ViewImage(e) {
				console.log(e)
				uni.previewImage({
					urls: e
				});
			},
			//删除
			DelImg(leng) {
				uni.showModal({
					title: '删除',
					content: '确定要删除这张图片？',
					cancelText: '取消',
					confirmText: '删除',
					success: res => {
						if (res.confirm) {
							this.addSevList.yyPath = '';
							this.addSevList.notBase64ImgPath = '';
						}
					}
				})
			},
			addlaji() {
				this.tc = 2;
				this.getLajiTwo();
			},
			addcg() {
				this.tc = 1;
			},

			/**
			 * 免费服务类型
			 * @param {Object} id
			 */
			ferr(id, ss) {
				//console.log(id)
				if (ss == 2) {
					id.freeDate = null;
				}
				this.sp = id.id
				this.ss = ss;
			},
			/**
			 * 日期组件
			 * @param {Object} e
			 */
			bindDateChange: function(e) {
				console.log(e)

				let vd = e.target.value;
				this.sdate = vd;
				for (let i in this.cgList) {
					let ti = this.cgList[i];
					if (ti.id == e.target.id) {
						ti.freeDate = vd;
					}
				}

				console.log(this.sdate)
			},
			/**
			 * 日期组件
			 * @param {Object} e
			 */
			addBindDateChange: function(e) {
				console.log(e)

				let vd = e.target.value;
				this.addSevList.freeDate = vd;
			},
			getDate(type) {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();

				if (type === 'start') {
					year = year - 60;
				} else if (type === 'end') {
					year = year + 2;
				}
				month = month > 9 ? month : '0' + month;
				day = day > 9 ? day : '0' + day;
				return `${year}-${month}-${day}`;
			},
			/**
			 * 省市区三级联动
			 * @param {Object} e
			 */
			pickerChange(e) {
				// console.log(e, '1');
				this.regionIndex = e.detail.value;
				this.regionStr = this.region[0][this.regionIndex[0]].name + this.region[1][this.regionIndex[1]].name +
					this.region[2][this.regionIndex[2]].name;
				console.log(this.regionStr);
				// 组件传值
				this.$emit('region', [this.region[0][this.regionIndex[0]].code, this.region[1][this.regionIndex[1]].code,
					this.region[
						2][this.regionIndex[2]].code
				]);
			},
			pickerColumnchange(e) {
				// console.log(e);
				// 第几列滑动
				// console.log(e.detail.column);
				// 第几列滑动的下标
				// console.log(e.detail.value)

				if (e.detail.column === 0) {
					// 声明城市数组
					let cityArr = [];
					let countyArr = [];
					// 设置下标
					this.regionIndex = [e.detail.value, 0, 0];
					// 改变城市列表
					this.region[1] = this.oldRegion[e.detail.value].children.map(item => {
						cityArr.push({
							name: item.name,
							code: item.code
						});
					})
					this.$set(this.region, 1, cityArr);
					// 改变县区列表
					this.oldRegion[e.detail.value].children[0].children.map(item => {
						countyArr.push({
							name: item.name,
							code: item.code
						});
					})
					this.$set(this.region, 2, countyArr);
				}
				if (e.detail.column === 1) {
					this.regionIndex[1] = e.detail.value;
					this.regionIndex[2] = 0;
					let countyArr = [];
					this.oldRegion[this.regionIndex[0]].children[this.regionIndex[1]].children.map(item => {
						countyArr.push({
							name: item.name,
							code: item.code
						});
					})
					this.$set(this.region, 2, countyArr);
				}
				if (e.detail.column === 2) {
					this.regionIndex[2] = e.detail.value;
				}
			},
			/**
			 * 编辑站点信息
			 */
			addStation: function() {
				uni.showLoading({});
				let cglist = this.cgList;
				let completionDate = this.stationInfo.completionDate
				let disableIndustry = this.stationInfo.disableIndustry
				cglist.push({
					id: this.siteAlterId,
					villageName: this.villageNamem, //站点名称
					villageAgent: this.villageAgent, //分配站长
					villageAddress: this.villageAddress, //站点地址
					villageProperty: this.villageProperty, //所属物业
					area: this.regionStr, //所属地区
					imgPath: null,
					updateDatetime: new Date(),
					completionDate: completionDate ? new Date(completionDate) : null, //竣工年份
					disableIndustry: disableIndustry.length == 0 ? null : disableIndustry.toString(), //禁用行业
					occupancyNumber: this.stationInfo.occupancyNumber || null
				})
				for (let i in cglist) {
					cglist[i].villageName = this.villageName; //站点名称
					cglist[i].villageAgent = this.villageAgent; //分配站长
					cglist[i].villageAddress = this.villageAddress; //站点地址
					cglist[i].villageProperty = this.villageProperty; //所属物业
					cglist[i].area = this.regionStr; //所属地区
					cglist[i].imgPath = null;
					cglist[i].updateDatetime = new Date();
					this.alterList.push(cglist[i]); //添加进请求参数
				}
				let laji = this.lajiList;
				for (let j in laji) {
					laji[j].villageName = this.villageName; //站点名称
					laji[j].villageAgent = this.villageAgent; //分配站长
					laji[j].villageAddress = this.villageAddress; //站点地址
					laji[j].villageProperty = this.villageProperty; //所属物业
					laji[j].area = this.regionStr; //所属地区
					laji[j].updateDatetime = new Date();
					this.alterList.push(laji[j]); //添加进请求参数
				}
				uni.request({
					url: this.baseURL + '/guiminSite/alter/list',
					method: 'POST',
					header: {
						'content-type': 'application/json;carset=utf-8',
						'token': uni.getStorageSync('token')
					},
					data: this.alterList,
					success: (res) => {
						console.log(res)
						uni.hideLoading();
						uni.showToast({
							title: '编辑成功',
							duration: 2500,
							icon: 'success'
						})
						setTimeout(function() {
							uni.redirectTo({
								url: "./station"
							})
						}, 2500);
					},
					fail: (err) => {
						uni.hideLoading();
						console.log(err)
					}
				})
			},
			/**
			 * 添加站点常规服务
			 */
			addCgServeData() {
				let _ts = this;
				let req = {
					'villageName': this.villageName, //站点名称
					'villageAgent': this.villageAgent, //分配站长
					'villageAddress': this.villageAddress, //站点地址
					'area': this.regionStr,
					'villageProperty': this.villageProperty, //所属物业
					'serveLists': this.addSevList, //常规服务
				}
				uni.request({
					url: this.baseURL + '/guiminSite/add/cg',
					method: 'POST',
					header: {
						'content-type': 'application/json;carset=utf-8',
						'token': uni.getStorageSync('token')
					},
					data: req,
					success(res) {
						console.log(res);
						if (res.data.success == true) {
							uni.showToast({
								title: '添加成功',
								icon: 'success',
								duration: 2000
							})
							let villObj = {
								'villageName': _ts.villageName
							};
							_ts.cgList = [];
							_ts.getStisCGtList(villObj);
							_ts.serList = [];
							_ts.tc = false;
						} else {
							uni.showToast({
								title: res.data.message,
								icon: 'error',
								duration: 2000
							})
						}
					},
					fail(err) {
						uni.showToast({
							title: err.message,
							icon: 'error',
							duration: 2000
						})
					}
				})
			},
			/**
			 * 添加站点垃圾服务
			 */
			addLajiServeData() {
				let _ts = this;
				let req = {
					'villageName': this.villageName, //站点名称
					'villageAgent': this.villageAgent, //分配站长
					'villageAddress': this.villageAddress, //站点地址
					'area': this.regionStr,
					'villageProperty': this.villageProperty, //所属物业
					'recycleLists': this.lajiAddList //废旧回收
				}
				uni.request({
					url: this.baseURL + '/guiminSite/add/laji',
					method: 'POST',
					header: {
						'content-type': 'application/json;carset=utf-8',
						'token': uni.getStorageSync('token')
					},
					data: req,
					success(res) {
						console.log(res);
						if (res.data.success == true) {
							uni.showToast({
								title: '添加成功',
								icon: 'success',
								duration: 2000
							})
							let villObj = {
								'villageName': _ts.villageName
							};
							_ts.lajiList = [];
							_ts.getLaJiList(villObj);
							_ts.lajiAddList = [];
							_ts.tc = false;
						} else {
							uni.showToast({
								title: res.data.message,
								icon: 'error',
								duration: 2000
							})
						}
					},
					fail(err) {
						uni.showToast({
							title: err.message,
							icon: 'error',
							duration: 2000
						})
					}
				})
			},
			/**
			 * 添加服务
			 * @param {Object} e
			 */
			checkboxChange: function(e) {
				let data = e //JSON.parse(e);
				data.checked = !data.checked;
				if (data.checked == true) {
					this.serList.push(data);
					console.log(JSON.stringify(this.serList))
				} else {
					for (let y in this.serList) {
						let it = this.serList[y];
						if (it.id == data.id) {
							var index = this.serList.findIndex(item => item.id == it.id)
							console.log(index)
							this.serList.splice(index, 1);
						}
					}
					console.log(JSON.stringify(this.serList))
				}
			},
			/**
			 * 添加废旧回收服务
			 * @param {Object} e
			 */
			lajicheckboxChange: function(e) {
				let data = e //JSON.parse(e);
				data.checked = !data.checked;
				if (data.checked == true) {
					this.lajiAddList.push(data);
					console.log(JSON.stringify(this.lajiAddList))
				} else {
					for (let y in this.lajiAddList) {
						let it = this.lajiAddList[y];
						if (it.id == data.id) {
							var index = this.lajiAddList.findIndex(item => item.id == it.id)
							console.log(index)
							this.lajiAddList.splice(index, 1);
						}
					}
					console.log(JSON.stringify(this.lajiAddList))
				}
			},
			/**
			 * 获取物业列表
			 */
			getWuyeList: function() {
				let ts = this;
				uni.request({
					url: ts.baseURL + '/property/list',
					method: 'GET',
					header: {
						'content-type': 'application/json;carset=utf-8',
						'token': uni.getStorageSync('token')
					},
					success(res) {
						console.log(res);
						uni.hideLoading()
						let data = res.data;
						if (data.code == 0) {
							let rec = data.data.records;
							//console.log(aa)
							for (let key in rec) {
								console.log(rec[key])
								ts.wuyeList.push(rec[key]);
							}
							ts.wuye = 1;
						} else {
							uni.showToast({
								title: data.message,
								icon: 'none'
							})
						}
					},
					fail: (e) => {
						console.warn(e)
						uni.hideLoading()
					}
				})
			},
			/**
			 * 获取站长列表
			 */
			getAgentList: function() {
				let _tis = this;
				uni.request({
					url: _tis.baseURL + '/agent/list?current=1&size=10',
					method: 'GET',
					header: {
						'content-type': 'application/json;carset=utf-8',
						'token': uni.getStorageSync('token')
					},
					success(res) {
						//console.log(res);
						uni.hideLoading()
						let data = res.data;
						if (data.code == 0) {
							data = data.data
							let aa = data.records;
							//console.log(aa)
							for (let key in aa) {
								//console.log('===========================',aa[key]);
								_tis.agentList.push(aa[key]);
							}
							_tis.zhanz = 1;
							//console.log(_tis.agentList);
						} else {
							uni.showToast({
								title: data.message,
								icon: 'none'
							})
						}
					},
					fail: (e) => {
						console.warn(e)
						uni.hideLoading()
					}
				})
			},
			/**
			 * 按id删除
			 * @param {Object} imte
			 */
			deleteFuwu(imte, type) {
				let t_h_i_s_ = this;
				uni.showModal({
					title: '是否删除该服务？',
					success: function(res) {
						if (res.confirm) {
							uni.request({
								url: t_h_i_s_.baseURL + '/guiminSite/delete?id=' + imte.id,
								method: 'GET',
								header: {
									'token': uni.getStorageSync('token')
								},
								success(res) {
									console.log(res);
									if (res.data.success == true) {
										uni.showToast({
											title: res.data.message,
											icon: 'success'
										})
										let nameObj = {
											'villageName': t_h_i_s_.villageName
										};
										if (type == 1) {
											t_h_i_s_.cgList = [];
											t_h_i_s_.getStisCGtList(nameObj);
										}
										if (type == 2) {
											t_h_i_s_.lajiList = [];
											t_h_i_s_.getLaJiList(nameObj);
										}
									} else {
										uni.showToast({
											title: res.data.message,
											icon: 'error'
										})
									}
								},
								fail: (e) => {
									console.warn(e)
								}
							})

						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				})
			},

			/**
			 * 获取垃圾回收服务列表
			 */
			getLaJiList: function(req) {
				let ts = this;
				uni.request({
					url: ts.baseURL + '/guiminSite/list/laji',
					method: 'POST',
					header: {
						'content-type': 'application/json;carset=utf-8',
						'token': uni.getStorageSync('token')
					},
					data: req,
					success(res) {
						//console.log(res);
						let data = res.data.data;
						if (res.data.success == true) {
							for (let key in data) {
								ts.lajiList.push(data[key]);
							}
							//console.log(ts.lajiList)
						} else {
							uni.showToast({
								title: res.data.message,
								icon: 'none'
							})
						}
					},
					fail: (e) => {
						console.warn(e)
						uni.hideLoading()
					}
				})
			},
			/**
			 * 获取常规服务列表
			 */
			getStisCGtList: function(req) {
				let _tis = this;
				uni.showLoading()
				uni.request({
					url: _tis.baseURL + '/guiminSite/list/cg',
					method: 'POST',
					header: {
						'content-type': 'application/json;carset=utf-8',
						'token': uni.getStorageSync('token')
					},
					data: req,
					success(res) {
						//console.log(res);
						let data = res.data.data;
						if (res.data.success == true) {
							uni.hideLoading()
							for (let key in data) {
								//console.log('===========================',data[key]);
								_tis.cgList.push(data[key]);
							}
							//	console.log(_tis.cgList);
						} else {
							uni.hideLoading()
							uni.showToast({
								title: res.data.message,
								icon: 'none'
							})
						}
					},
					fail: (e) => {
						console.warn(e)
						uni.hideLoading()
					}
				})
			},
			/**
			 * 获取服务列表
			 */
			getServeList: function() {
				let th_is = this;
				uni.request({
					url: th_is.baseURL + '/guiminService/list/f',
					method: 'POST',
					header: {
						'content-type': 'application/json;carset=utf-8',
						'token': uni.getStorageSync('token')
					},
					success(res) {
						//console.log(res);
						uni.hideLoading()
						let data = res.data;
						if (data.success == true) {
							let va = data.data; //写入服务表
							///console.log(va);
							for (var i = 0, lenI = va.length; i < lenI; ++i) {
								th_is.serveList.push(va[i]);
								//console.log(va[i]);
							}
							//console.log(JSON.stringify(th_is.serveList));
						} else {
							uni.showToast({
								title: res.data.message,
								icon: 'none'
							})
						}
					},
					fail: (e) => {
						console.warn(e)
						uni.hideLoading()
					}
				})
			},
			/**
			 * 获取废旧回收一级数据
			 */
			getLajiOne() {
				let tis = this;
				uni.request({
					url: tis.baseURL + "/Recycle/list/one",
					method: 'POST',
					header: {
						'content-type': 'application/json;carset=utf-8',
						'token': uni.getStorageSync('token')
					},
					success: (res) => {
						//console.log(res)
						if (res.data.success == true) {
							let laji = res.data.data
							for (var i = 0, lenI = laji.length; i < lenI; ++i) {
								tis.lajiOneList.push(laji[i]);
							}
							//console.log(tis.lajiOneList)
						} else {
							uni.showToast({
								title: res.data.message,
								icon: 'error'
							})
						}
					},
					fail: (err) => {
						console.warn(err)
					}
				})
			},
			/**
			 * 获取废旧回收二级数据
			 */
			getLajiTwo() {
				let this_ = this;
				uni.request({
					url: this_.baseURL + "/Recycle/list/two",
					method: 'POST',
					header: {
						'content-type': 'application/json;carset=utf-8',
						'token': uni.getStorageSync('token')
					},
					success: (res) => {
						//console.log(res)
						this_.lajiTwoList = [];
						let arr = [];
						if (res.data.success == true) {
							let lajitwo = res.data.data
							for (var i = 0, lenI = lajitwo.length; i < lenI; ++i) {
								this_.lajiTwoList.push(lajitwo[i]);
								arr.push(lajitwo[i]);
								//console.log(this_.lajiTwoList)
							}
							console.log(this_.lajiTwoList)
							for (let k in arr) {
								let tname = arr[k].twoName;

								for (let y in this_.lajiList) {
									let yname = this_.lajiList[y].recyclesTwoName
									//console.log(tname+'-'+yname)
									if (yname == tname) {
										console.log(k)
										this_.lajiTwoList.splice(k, 1, "填充数据");
									}
								}
							}
						} else {
							uni.showToast({
								title: res.data.message,
								icon: 'error'
							})
						}
					},
					fail: (err) => {
						console.warn(err)
					}
				})
			},
		},
		created() {
			let provinceArr = [];
			let cityArr = [];

			this.oldRegion.map((item, index) => {
				this.region[0].push({
					name: item.name,
					code: item.code
				});
				if (this.previnceId == item.code) {
					provinceArr = item.children;
					this.regionIndex[0] = index;
				}
			})
			// console.log(provinceArr);
			provinceArr.map((item, index) => {
				this.region[1].push({
					name: item.name,
					code: item.code
				});
				if (this.cityId == item.code) {
					cityArr = item.children;
					this.regionIndex[1] = index;
				}
			})
			cityArr.map((item, index) => {
				this.region[2].push({
					name: item.name,
					code: item.code
				});
				if (this.countyId == item.code) {
					this.regionIndex[2] = index;
				}
			})
			if (this.isRevise) {
				this.regionStr = this.region[0][this.regionIndex[0]].name + ' ' + this.region[1][this.regionIndex[1]]
					.name + ' ' +
					this.region[2][this.regionIndex[2]].name;
			} else {
				this.regionStr = '请选择省市区';
			}
		},
		onLoad: function(ym) {
			console.log(ym.name)
			if (ym.name == null || ym.name == undefined) {
				uni.showToast({
					title: '为获取站点id',
					icon: 'error',
					duration: 2000
				})
				return;
			}
			this.villageName = ym.name; //名称
			this.villageAddress = ym.dz; //地址
			this.villageAgent = ym.zz; //站长
			this.villageProperty = ym.wy; //物业
			this.area = ym.qy; //所在区域
			this.siteAlterId = ym.id; //该站点唯一id
			let yemData = {
				'villageName': ym.name
			};
			console.log(yemData)
			this.getLaJiList(yemData); //获取站点垃圾服务
			this.getStisCGtList(yemData); //获取站点常规服务
			this.getBoothPage(1, 100, {
				stationId: ym.id
			})

			let industryArr = []
			for (let item of this.industryList) {
				industryArr.push({
					name: item,
					checked: false
				})
			}
			this.industryList = industryArr
			let stationInfo = uni.getStorageSync('stationInfo')
			if (stationInfo) {
				stationInfo = JSON.parse(stationInfo)
				//小区环境图片
				if ('stationImgs' in stationInfo) {
					let _arr = stationInfo.stationImgs.split(',').map((v, k) => {
						return {
							path: "https://admin.yunshuicha.com/images/station/" + v
						};
					})
					// console.log(stationImgs, _arr)
					this.stationInfo.stationImgs = _arr;
				}
				this.stationInfo.occupancyNumber = stationInfo.occupancyNumber
				this.stationInfo.completionDate = stationInfo.completionDate //小区收楼年份
				if (stationInfo.disableIndustry) { //小区禁止行业
					this.industryList.forEach(item => {
						if (stationInfo.disableIndustry.indexOf(item.name) > -1) {
							item.checked = true
						}
					})
				}
			}
		},
		onUnload: () => {
			uni.removeStorageSync('stationInfo')
		}
	}
</script>
<style>
	.p-checkbox {
		display: none;
		position: absolute;
		background-color: #fff;
		border: 1px solid #cccc;
		padding: 10px;
	}

	*:hover>.p-checkbox {
		display: block;
		z-index: 10;
		height: 200px;
		overflow-y: auto;
	}

	.popup-layer {
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		display: flex;
		width: 100vw;
		height: 100vh;
		justify-content: center;
		align-items: center;
		background-color: rgba(0, 0, 0, 0.2);
		z-index: 98;
	}

	.win-card {
		display: block;
		width: 800px;
		height: 600px;
		border: 1px solid #ccc;
		background-color: #fff;
	}

	.win-head {
		display: flex;
		height: 40px;
		line-height: 40px;
		border-bottom: 1px solid #ccc;
		justify-content: space-between;
	}

	.win-body {
		display: block;
		height: calc(100% - 42px);
		overflow-y: auto;
	}

	.form-name,
	.form-value {
		display: inline-block;
		vertical-align: top;
		line-height: 24px;
		word-wrap: break-word;
		margin: 10px;
		font-size: 14px;
	}

	.form-name {
		width: 120px;
		color: #666;
		text-align: end;
	}

	.form-value {
		max-width: calc(100% - 200px);
	}
</style>
